<template>
  <div class="broad_list_detail">

    <div class="broad_list_first">
      <div class="broad_list_first_left">
        <img draggable="false" src="static/image/home/chat/broadlistimg.png" />
        <span>详情</span>

      </div>
      <div class="broad_list_first_right">
        <div class="broad_delete" @click.stop.prevent="broadDelete"></div>
        <div class="broad_close" @click.stop.prevent="broadClose"></div>
      </div>
    </div>
    <div class="broad_main_w">
      <div class="b_m_t">
        <span>{{ broad_show_item.title }}</span>
        <!-- {{ broad_show_item.files}} -->
      </div>
      <div class="b_m_n">
        <span>{{ broad_show_item.name }}</span>
        <span class="b_m_l"></span>
        <span class="b_m_time">{{ broad_show_item.time | getTimeAll }}</span>
      </div>
      <div class="b_m_v_w">
        <div class="b_m_c" v-html="broad_show_item.value"></div>
        <div class="b_m_f">
          <div class="broad_file_wrap" v-for="(item, index) in broad_show_item.files" :key="'broad_' + index">
            <div class="broad_f_l"></div>
            <div class="broad_f_r">
              <div class="broad_f_name">{{ item.attachName }}</div>
              <div class="broad_f_size">
                <span class="broad_f_size_text">{{item.attachsize | convertByte}}</span>
                <span v-if="item.isUpload.isDownLoad == 0 && (item.isDownLoad == 0 || !item.isDownLoad)" class="broad_f_dl" @click.stop.prevent="downFile(item)">下载</span>
                <span v-else class="broad_f_dl" @click.stop.prevent="toPreviewFile(item,broad_show_item)">查看</span>
              </div>
              <Progress class="broad_p" v-if="item.upload==1" :percent="item.progress?item.progress:0" status="active"></Progress>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="b_m_w_p_u">
      <div @click.stop.prevent="upPage('upPage')" v-if="broad_show_item_index > 0">
        <span>{{'上一条'}}</span>
        <span>{{list[broad_show_item_index - 1].title}}</span>
        <img v-if="list[broad_show_item_index - 1].isRead == 0" src="static/image/home/broad/news_new.png" />
      </div>
      <!-- 当前页第一条时 -->
      <div v-else-if="isTriggerPageUp" @click.stop.prevent="newPageFn('upPage')">
        <span>{{'上一条'}}</span>
        <span>{{temp?temp.title:pageBroadList[pageBroadList.length - 1].title}}</span>
        <img v-if="temp?temp.isRead == 0:pageBroadList[pageBroadList.length - 1].isRead == 0" src="static/image/home/broad/news_new.png" />
      </div>
      <div v-else></div>
      <div @click.stop.prevent="downPage('downPage')" v-if="broad_show_item_index < list.length - 1">
        <span>{{'下一条'}}</span>
        <span>{{list[broad_show_item_index + 1].title}}</span>
        <img v-if="list[broad_show_item_index + 1].isRead == 0" src="static/image/home/broad/news_new.png" />
      </div>
      <!-- 当前页最后一条时 -->
      <div v-else-if="isTriggerPageDown" @click.stop.prevent="newPageFn('downPage')">
        <span>{{'下一条'}}</span>
        <span>{{temp?temp.title:pageBroadList[0].title}}</span>
        <img v-if="temp?temp.isRead == 0:pageBroadList[0].isRead == 0" src="static/image/home/broad/news_new.png" />
      </div>
      <div v-else></div>
    </div>
  </div>
</template>
<script>
import { mapState } from "vuex";

import tools from "@/utils/tools";
export default {
  props: {
    list: {
      type: Array,
      required: true,
      default: () => {
        return [];
      },
      twoWays: true,
    },
    pageBroadList: {
      type: Array,
      default: () => {
        return [];
      },
    },
    broad_show_item: {
      type: Object,
    },
    broad_show_item_index: {
      type: Number,
    },
  },
  data() {
    return {
      isTriggerPageUp: false,
      isTriggerPageDown: false,
      typePage: "",
      temp: null,
    };
  },
  watch: {
    pageBroadList() {
      if (this.typePage == "upPage") {
        this.isTriggerPageUp = true;
        this.isTriggerPageDown = false;
      } else if (this.typePage == "downPage") {
        this.isTriggerPageUp = false;
        this.isTriggerPageDown = true;
      }
    },
    broadType() {
      if (this.broadType) {
        // 当前为最后一页最后一条时、当前为第一页第一条时
        if (this.broadType == "noShow") {
          this.isTriggerPageUp = false;
          this.isTriggerPageDown = false;
        } else if (this.broadType == "showUpPage") {
          this.isTriggerPageUp = true;
          this.isTriggerPageDown = false;
        }
        this.typePage = this.broadType;
        this.$emit("searchBroadList", this.broadType);
        this.$store.commit("setBroadType", "");
      }
    },
    typePage() {
      console.log("this.pageBroadList", this.pageBroadList);
      //this.pageBroadList();
    },
  },
  computed: {
    ...mapState(["myInfo", "broadType"]),
    tableId() {
      return this.myInfo.id;
    },
    sqlTable() {
      return {
        broadcastList: `broadcast_list_${this.tableId}`, //广播列表
      };
    },
  },
  mounted() {
    console.log(11114, this.broad_show_item);
  },
  //过滤器filter
  filters: {
    convertByte(byteCount) {
      var count = parseFloat(byteCount || 0),
        unitArr = ["b", "Kb", "Mb", "Gb", "Tb"],
        index = 0;
      if (!count) return 0;
      for (let i = 0; i < 5; i++) {
        if (count >= 1024) {
          count = count / 1024;
          index++;
        } else {
          return index > 0
            ? count.toFixed(2) + unitArr[index]
            : count + unitArr[index];
        }
        if (index == 4) {
          return count.toFixed(2) + unitArr[index];
        }
      }
    },
  },
  methods: {
    // sql语句封装 1为搜索, 其他不需要参数
    operationalDatabase(statements, index) {
      let to = JSON.stringify({
        Sqlstr: statements,
      });
      return arguments[1]
        ? JSON.parse(this.$shellSQL(to, index))
        : JSON.parse(this.$shellSQL(to));
    },
    upPage(type) {
      this.temp = null;
      this.$emit("pageIndex", this.broad_show_item_index - 1);
      this.broad_show_item_index = this.broad_show_item_index - 1;
      this.isTriggerPageUp = false;
      this.isTriggerPageDown = false;
      // 当前页第一条时查询上一页内容
      if (this.broad_show_item_index == 0) {
        this.$emit("searchBroadList", type);
        this.typePage = type;
      }
      this.$forceUpdate();
    },
    downPage(type) {
      this.temp = null;
      this.$emit("pageIndex", this.broad_show_item_index + 1);
      this.broad_show_item_index = this.broad_show_item_index + 1;
      this.isTriggerPageUp = false;
      this.isTriggerPageDown = false;
      // 当前页最后一条时查询下一页内容
      if (this.broad_show_item_index == this.list.length - 1) {
        this.$emit("searchBroadList", type);
        this.typePage = type;
      }
      this.$forceUpdate();
    },
    newPageFn(type) {
      this.temp = this.list[this.broad_show_item_index];
      this.$emit("newPageFn", type);
      this.typePage = type;
      if (this.typePage == "upPage") {
        this.isTriggerPageUp = false;
        this.isTriggerPageDown = true;
      } else if (this.typePage == "downPage") {
        this.isTriggerPageUp = true;
        this.isTriggerPageDown = false;
      }
    },
    broadDelete() {
      this.$emit("broadDelete");
    },
    broadClose() {
      this.$emit("broadClose");
    },
    downFile(item) {
      console.log(item, this.broad_show_item, "文件信息1");
      let _this = this;
      let index = item.attachName.lastIndexOf("/");
      this.$set(item, "messageId", this.broad_show_item.messageId);
      // 新增广播文件下载标识字段flag:'broad'
      let broadItem = Object.assign(item, { flag: "broad" });
      this.$emit("downloadListAddProcess", broadItem);
   
        let str = item.attachName.substring(index + 1, item.attachName.length);
        let fileName = str.lastIndexOf("."); //取到文件名开始到最后一个点的长度
        let fileNameLength = str.length; //取到文件名长度
        let fileFormat = str.substring(fileName + 1, fileNameLength); //截
        let info = _this.$shell("SaveFileUrl", [
          _this.myInfo.id,
          _this.$store.state.url +
            "api/v1/oim/file/download.do?id=" +
            item.attach,
          this.broad_show_item.messageId,
          str,
          fileFormat,
          "",
        ]);
        info = JSON.parse(info);
        console.log(info, "下载文件");
        if (info.return_code == "TRUE") {
          this.$Message.success("文件下载中,请稍后");
          this.$set(item, "loading", true);
        }
     
    },
    //文件预览
    toPreviewFile(item, itemInfo) {
      console.log("查看文件信息", item, itemInfo);
      let path = item.isUpload.isDownLoad || item.isDownLoad;
      let rep = this.$shell("OpenFlieByUrl", [this.$isRelativePath(path)]);
      rep = JSON.parse(rep);
      let donwLoad;
      if (rep.return_code == "FALSE") {
        this.$Message.info("系统找不到指定的文件,请重新下载");
        item.isUpload.isDownLoad = 0;
        this.$set(item, "isDownLoad", 0);
        let donwLoadList = tools.operationalDatabase(
          `SELECT fileMap FROM ${this.sqlTable.broadcastList} WHERE messageId = '${itemInfo.messageId}';`,
          1
        );
        if (donwLoadList.list.length > 0) {
          donwLoad = JSON.parse(donwLoadList.list[0].fileMap);
        }
        donwLoad.forEach((i) => {
          if (i.downLoadId == item.isUpload.downLoadId) {
            i.isDownLoad = 0;
          }
        });

        let strD = JSON.stringify(donwLoad);
        tools.operationalDatabase(
          // 更改数据库下载状态
          `UPDATE ${this.sqlTable.broadcastList} SET fileMap = '${strD}' WHERE messageId='${itemInfo.messageId}';`
        );
        return;
      }
    },
  },
  components: {},
  created() {
    let donwLoad = JSON.parse(this.broad_show_item.fileMap);
    this.broad_show_item.fileMap = donwLoad;
  },
};
</script>
